.z-count {
  display: inline-flex;
  align-items: center;

  &--item {
    display: inline-flex;
    align-items: center;

    & + & {
      margin-left: 64px;
    }
  }

  &--icon {
    $size: 48px;
    width: $size;
    color: var(--z-icon-color, var(--z-main-color));
    height: $size;
    display: flex;
    font-size: 24px;
    align-items: center;
    border-radius: 50%;
    justify-content: center;
    background-color: var(--z-icon-bg-color, var(--z-main-color-light-2));
  }

  &--info {
    margin-left: var(--z-page-padding);
  }

  &--label {
    color: var(--z-text-color);
    font-size: 14px;
  }

  &--note {
    font-size: 12px;
    margin-left: 4px;
  }

  &--innter {
    display: flex;
    align-items: baseline;
  }
  &--value {
    color: var(--z-text-color-primary);
    font-size: 18px;
    font-weight: bold;
  }

  &--unit {
    color: var(--z-text-color);
    font-size: 14px;
    margin-left: 8px;
  }
}
